import React,{Component} from 'react'

import {
    View,
    Text,
    FlatList,
    StyleSheet,
    Alert,
    ToastAndroid,
    ScrollView,
    ActivityIndicator,
    Dimensions,
    TouchableNativeFeedback
}from 'react-native'

const { width, height } = Dimensions.get('window');

var testdata=[1,2,3,4,5,6,7]

const styles=StyleSheet.create({
    item:{
        width:width,
        height:50,
        flexDirection:'row',
        justifyContent:'space-around',
        alignItems:'center',
        backgroundColor:'white'
    },
    loading: {
        marginTop: 100,
    },
    itemleft:{
        width:width*4/5,
        height:'100%',
        flexDirection:'row',
        justifyContent:'space-around',
        alignItems:'center'
    },
    itemright:{
        width:width/5,
        height:'100%',
        flexDirection:'row',
        justifyContent:'space-around',
        alignItems:'center'
    },
    jiange:{
        width:'100%',
        borderTopWidth:1,
        borderColor:'rgba(150,150,150,0.2)',
        height:1
    },
    topadd:{
        width:width,
        height:50,
        textAlign:'center',
        lineHeight:35
    }

})


export default class Employee extends Component{
    static navigationOptions={
        title:'员工管理',
        headerTitleStyle: {
        alignSelf:'center'
      },
    };

    state={
        employee:''
    }


    delete= async function(id,index){
        var response=await fetch(global.mainurl+'/bossHelper/deleteUser', {
                method: 'POST',
                 mode : 'cors',
                headers: {
                        'Content-Type': 'application/x-www-form-urlencoded'
                    },
                body: "id="+id+"&userid="+global.userdata.id+"&token="+global.token
         })
        let result=await response.json()
        console.log(result)
        if(result.code==1){
            var new1=this.state.employee
            new1.splice(index,1)
            this.setState({
                employee:new1
            })
            ToastAndroid.show('删除成功', ToastAndroid.SHORT);
        }
    }

    async componentWillMount(){
        this.getData()
      }

    getData=async function(){
        let response = await fetch(global.mainurl+"bossHelper/userlist?office.id="+global.sellerid+"&userid="+global.userdata.id+"&token="+global.token);
        let result=await response.json()
        console.log(result)
        this.setState({
            employee:result.data
        })
    }

    render(){
        return(
            <View style={styles.warp}>
                <Text style={styles.topadd}
                            onPress={ ()=>{
                    this.props.navigation.navigate('EmployeeAdd',{reload:()=>{this.getData()}})
                    }}
                >员工添加</Text>
                <View>
                {
                 this.state.employee?
                 <FlatList
                 style={{height:height-130}}
                 data={this.state.employee}
                 ItemSeparatorComponent={()=>{
                        return(
                            <View style={styles.jiange}/>
                            )
                        
                    }}
                 keyExtractor={(item, index) => index}
                 renderItem={
                     (item)=>{
                         return(
                             
                             <View style={styles.item}>
                                <TouchableNativeFeedback
                                onPress={()=>{
                                    this.props.navigation.navigate("EmployeeAdd",{reload:()=>{this.getData()},roledata:item.item,type:'修改'})
                                }}
                                >
                                <View style={styles.itemleft}>
                                <Text>
                                {item.item.name}
                                </Text>
                                </View>
                                </TouchableNativeFeedback>
                                <TouchableNativeFeedback
                                onPress={()=>{
                                    Alert.alert(
                                        '确定删除员工？',
                                        null,
                                        [
                                        {text: '取消', onPress: () => {}},
                                        {text: '确定', onPress: () => this.delete(item.item.id,item.index)},
                                        {text: '', onPress: () =>{} },
                                        ]
                                    )
                                    
                                }}
                                >
                                <View style={styles.itemright}>
                                <Text>
                                删除员工
                                </Text>
                                </View>
                                </TouchableNativeFeedback>
                                
                             </View>
                             
                         )
                     }
                 }
                 />
                 :
                 <ActivityIndicator size="large" style={styles.loading} />
                 }
                </View>
            </View>
        )
    }
}
